<template>
    <div class="home">
        <p>姓名:{{ name }}</p>
        <p>年龄： {{age}}</p>
        <p>地址：{{address}}</p>
        <p @click="changName">修改名字</p>
        <p @click="changAge">修改年龄</p>
        <p @click="changTel">修改电话</p>
    </div>
</template>


<script setup lang="ts" name = "Homexiali">
import { ref} from 'vue';
    let name = ref( "张三");
    let age =  ref(18);
    let tel ='13311596990';
    let address ="北京大兴区";
    console.log(name)
    console.log(age)
    console.log(tel)
    console.log(address)
    function changName(){
       name.value ="XXX11"
    }
    function changAge(){
        age.value+=1
    }
    function changTel(){
        alert(tel)
    }

</script>

<style lang="scss" scoped>

</style>